<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <title>个人资料</title>

    <link rel="stylesheet" type="text/css" href="../../css/api.css"/>
    <link rel="stylesheet" type="text/css" href="../../css/style.css"/>
    <link rel="stylesheet" type="text/css" href="../../css/yzl.css"/>
    <style>
        .selectActive {
            background-color: #FADDCF !important;
            color: #EB7B3D;
        }

        .goods-status {
          background-color:#9D0152;
          color: #ffffff;
          border: 1px solid #ffffff;
        }
        .taps-active{
          background-color:#ffffff;
          color:#9D0152;
        }
        .extendgray{
          color: #8F8F8F;
        }
    </style>
</head>
<body>
<div id="app" v-cloak >
  <div id="blank" class="header shopheader" v-cloak>
      <div v-back.tapmode class="getback"></div>
      <span class="goods-taps">
        <ul class="tabs-info">
          <li  class="goods-status goods-all" :class="{'taps-active':istapsActive==1}" v-myclick="[1, changeStatus]">全部商品</li>
          <li  class="goods-status goods-cate" :class="{'taps-active':istapsActive==2}" v-myclick="[2, changeStatus]">商品分类</li>
        </ul>
      </span>
      <!-- <span tapmode  style="position:absolute;right:10px;font-size:14px;" v-show="moreActive===1" tapmode v-open-win vurl="search">搜索</span> -->
      <span tapmode v-myclick="[1, moremanage]"  style="position:absolute;right:10px;font-size:14px;" v-show="moreActive===2">完成</span>
  </div>
    <div class="main-container" v-cloak v-show="istapsActive===1" style="padding-bottom:30px">
        <div class="row-container" style="margin-top:0px">
            <div class="goods_tab" style="position:fixed;top:60px;background:#ffffff;z-index:1000">
                <div class="tab-one" v-myclick="[12, changeBottom]">
                    <span :class="{'active':isActive==12}">出售中({{states.onsalenumber}})</span>
                </div>
                <div class="tab-one" v-myclick="[11, changeBottom]">
                    <span :class="{'active':isActive==11}">未上架({{states.preparesalenumber}})</span>
                </div>
                <div class="tab-one" v-myclick="[13, changeBottom]">
                    <span :class="{'active':isActive==13}">已下架({{states.offsalenumber}})</span>
                </div>
                <div class="tab-one" v-myclick="[14, changeBottom]">
                    <span :class="{'active':isActive==14}">已售罄({{states.outsalenumber}})</span>
                </div>
            </div>
            <div style="padding-top:38px">
            <div class="goods_info" v-for="(good, index) in goods" :key="key">
              <div class="goods-detail" v-myclick="[good, opebrowser]">
                <div class="goods-pic">
                  <img v-image-resize="{src:good.pic}" :key="good.goods_id">
                </div>
                <div class="goods-detail-right">
                  <div class="goods-detail-title">{{good.title}}</div>
                  <div class="sell-price">
                    <div style="float:left;"><span style="color:#666666;">原价：</span><span style="color:#9d0152">￥{{good.prime}}</span></div>
                    <div style="float:left;padding-left:5px"><span style="color:#666666;">优惠价格：</span><span style="color:#9d0152">￥{{good.coupon_amount}}</span></div>
                    <div style="clear:both"></div>
                  </div>
                  <div class="goods_number" @click.stop="selectStatus(good)">
                    <span style="color:#E5001E"><span style="font-size:16px">赚</span>&nbsp;{{good.t6_gain_max}}</span>
                    <span style="padding-left:10px">销量：{{good.sale_count}}</span>
                    <img class="goods-radio" @click.stop="selectStatus(good)" v-src="'../../image/unselected.png'" v-show="good.select !== 1">
                    <img class="goods-confirm" @click.stop="selectStatus(good)" v-src="'../../image/selected.png'" v-show="good.select == 1">
                  </div>
                </div>
              </div>
            </div>
            </div>
        </div>
    </div>
    <div class="row-container"  v-show="istapsActive==2" style="padding-top:60px;margin-top:0px">
        <a class="row" v-row-active.tapmode v-open-win="{category_id:category.shop_category_id}" vurl="categoryinfo" v-for="(category, index) in categories">
            <span>{{category.name}}</span>
            <img class="row-arrow" v-src="'../../image/arrow_right_grey.png'">
            <span class="row-detail">{{category.count}}</span>
        </a>
    </div>
    <div class="shop-footer" v-show="istapsActive==1&&moreActive==1">
      <div class="confirm" v-myclick="[1, changeGoodsState]" v-show="isActive==12">确认下架</div>
      <div class="confirm" v-myclick="[2, changeGoodsState]" v-show="isActive==11||isActive==13">确认上架</div>
      <div class="moremanage" v-myclick="[2, moremanage]">更多管理</div>
    </div>
    <div class="shop-footer1" v-show="moreActive==2" style="position:fixed;bottom:0px;background-color:#ffffff;width:100%;">
      <div class="more-button">
        <div class="more-card">
          <img v-src="'../../image/user_icon_extension.png'" v-myclick="share" v-show="index==1">
          <img v-src="'../../image/user_icon_extension2.png'" v-myclick="share" v-show="index!=1">
        </div>
        <div :class="{'extendgray':index!=1}">推广</div>
      </div>
      <div class="more-button" v-show="isActive==12" v-myclick="[1, changeGoodsState]">
        <div class="more-card"><img v-src="'../../image/user_icon_offline.png'"></div>
        <div>下架</div>
      </div>
      <div class="more-button" v-show="isActive==11||isActive==13" v-myclick="[2, changeGoodsState]">
        <div class="more-card"><img v-src="'../../image/user_icon_online.png'"></div>
        <div>上架</div>
      </div>
      <div class="more-button" v-myclick="[3, changeGoodsState]">
        <div class="more-card"><img v-src="'../../image/user_icon_trash.png'"></div>
        <div>删除</div>
      </div>
      <div class="more-button" style="float:left;padding-left:10px" v-myclick="checkall">
        <div class="more-card">
          <img class="goods-radio"  v-src="'../../image/unselected.png'" v-show="ischeckall==0">
          <img class="goods-confirm" v-src="'../../image/selected.png'" v-show="ischeckall!=0">
          <!-- <img class="goods-confirm" v-src="'../../image/selected.png'" v-show="good.select == 1"> -->
        </div>
        <div style="float:left;">全选</div>
      </div>
    </div>
    <div class="shop-footer" v-show="istapsActive===2">
      <div class="confirm" v-myclick="[1,addcategory]">添加分类</div>
      <div class="moremanage" v-myclick="[1,editcategory]">分类编辑</div>
    </div>
    <lazy-load v-show="istapsActive===1" v-if="goods.length > 0" style="background-color:#f7f7f7;margin-bottom:70px"
               count-per-page="20"
               :arr="goods"
               :url="url"
               :param="param"
               ret-attr="memberGoods"
               >
    </lazy-load>
</div>
</body>
<script src="../../script/api.js"></script>
<script src="../../script/vue.js"></script>
<script src="../../script/app.js"></script>
<script src="../../script/url.js"></script>
<script src="../../script/common.js"></script>
<script src="../../script/components.js"></script>
<script>
    var vm,
        moreActive,
        isselected,
        goodsselected=[],
        goodsstate=12,
        categories,
        param,
        ischeckall=0,
        goods;

    apiready = function () {
      showProgress();
      UIScrollPicture = api.require('UIScrollPicture');
      MNActionButton = api.require('PIActionButton');
      wx = api.require('wx');
      setBSImg();
      var data = {
          member_id: getPrefs('member_id'),
          state:12,
      };
      param={
        state:goodsstate,
      }
      var callback = function (ret) {
          var home = ret.content;
          goods = home.memberGoods;
          states = home.states;
          categories = home.categories;
          max_count_onsale = home.max_count_onsale;
          left_count_onsale = home.left_count_onsale;
          initApp();
          api.parseTapmode();
      };
      pinet.post(URL.getMemberShopInfo, data, callback);
      addListeners();
    };

    function refresh() {
      var data = {
          member_id: getPrefs('member_id')
      };
      var callback = function (ret) {
          var home = ret.content;
          if (vm) {
              vm.categories = home.categories;
              vm.key++;
          } else {
              initApp();
          }
          api.refreshHeaderLoadDone();
      };
      var errback = function () {
          api.refreshHeaderLoadDone();
      };

      pinet.post(URL.getMemberShopInfo, data, callback, errback);
    }

    function initApp() {
        vm = new Vue({
            el: "#app",
            data: {
                isActive: 12,
                goodsstate:12,
                istapsActive: 1,
                moreActive: 1,
                isselected:1,
                index:0,
                max_count_onsale:max_count_onsale,
                left_count_onsale:left_count_onsale,
                param: param,
                goods: goods,
                ischeckall:0,
                key:0,
                categories:categories,
                url: URL.getMemberShopInfo,
            },
            methods: {
                changeBottom: function (index) {
                  showProgress();
                  this.isActive = index;
                  goodsstate = index;
                  vm.param={
                    state:goodsstate,
                  };
                  var data = {
                      member_id: getPrefs('member_id'),
                      state: index
                  };
                  var callback = function (ret) {
                    var home = ret.content;
                    vm.goods = home.memberGoods;
                    vm.states = home.states;
                    vm.categories = home.categories;
                    vm.max_count_onsale = home.max_count_onsale;
                    vm.left_count_onsale = home.left_count_onsale;
                    vm.ischeckall=0;
                    vm.index = 0;
                    vm.key++;
                  };
                  pinet.post(URL.getMemberShopInfo, data, callback);
                },
                changeStatus: function (index) {
                    this.istapsActive = index;
                    this.type = index;
                    this.moreActive=1;
                },
                moremanage: function (index) {
                  this.moreActive = index;
                },
                opebrowser:function(good){
                  if(good.goods_id){
                    openWin('../home/browser', {goods_id: good.goods_id});
                  }else if(good.goods_url){
                    openWin('shopbrowser',{auctionurl:good.goods_url,good:good})
                  }
                },
                addcategory: function (index) {
                    openWin("addcategory");
                },
                editcategory: function (index) {
                    openWin("editcategory");
                },
                category_detail:function(){
                    openWin("categoryinfo");
                },
                checkall:function(){
                  if(vm.goods){
                    if(vm.ischeckall==0){
                      for(var i=0;i<vm.goods.length;i++){
                      vm.goods[i]['select'] = 1;
                      goodsselected.push(vm.goods[i]['goods_id']);
                      vm.index++;
                    }
                      vm.ischeckall=1;
                    }else{
                      for(var i=0;i<vm.goods.length;i++){
                        vm.goods[i]['select'] = -1;
                      }
                      goodsselected= [];
                      vm.ischeckall=0;
                      vm.index=0;
                    }
                  }else {
                    if(vm.ischeckall==0){
                      for(var i=0;i<goods.length;i++){
                      goods[i]['select'] = 1;
                      goodsselected.push(goods[i]['goods_id']);
                      vm.index++;
                    }
                      vm.ischeckall=1;
                    }else{
                      for(var i=0;i<goods.length;i++){
                        goods[i]['select'] = -1;
                      }
                      goodsselected= [];
                      vm.ischeckall=0;
                      vm.index=0;
                    }
                  }
                },
                selectStatus: function (good) {
                  if(good.select == 1){
                    good.select = -1;
                    goodsselected.remove(good.goods_id);
                    vm.index = vm.index-1;
                  }else{
                    index = (vm.index+1);
                    if(index>vm.left_count_onsale&&(this.isActive ==11||this.isActive ==13)){
                      pinet.alert('亲，您最多只能上架'+max_count_onsale+'件商品');
                      return;
                    }
                    good.select = 1;
                    goodsselected.push(good.goods_id);
                    vm.index = index;
                  }
                },
                changeGoodsState:function(type){
                  if(goodsselected.length<1){
                    pinet.alert('请选择商品');
                    return;
                  }
                  index = (vm.index);
                  if(index>this.left_count_onsale&&(this.isActive ==11||this.isActive ==13)){
                    pinet.alert('亲，您最多只能上架'+max_count_onsale+'件商品');
                    return;
                  }
                  goodsselected = goodsselected.join('|');
                  var data = {
                      member_id: getPrefs('member_id'),
                      goodsselected: goodsselected,
                      type:type,
                      state:goodsstate
                  };
                  var callback = function (ret) {
                    if(ret.errcode==0){
                      var home = ret.content;
                      vm.goods = home.memberGoods;
                      vm.states = home.states;
                      vm.max_count_onsale = home.max_count_onsale;
                      vm.left_count_onsale = home.left_count_onsale;
                      goodsselected= [];
                      vm.ischeckall=0;
                      vm.index = 0;
                    }
                  };
                  pinet.post(URL.changeGoodsState, data, callback);
                },
                share: function (share) {
                    if(!getPrefs('token')){
                        reLogin();
                    }else{
                      if(goodsselected.length!==1){
                        return;
                      }
                      for(var i=0;i<goods.length;i++){
                        if(goods[i].select==1){
                          share = goods[i].share;
                        }
                    }
                      var sharestr = share.url;
                      var tempstr = sharestr.split("&");
                      for(var i=0;i<tempstr.length;i++){
                        var iscloud = tempstr[i].indexOf("member_id=");
                        if(iscloud>=0){
                          var old_member_id = tempstr[i].split("=")[1];
                          break;
                        }
                      }
                      var member_id = getPrefs('member_id');
                      if(old_member_id!==member_id){
                        var str1 = sharestr.replace('member_id='+old_member_id, 'member_id='+member_id);
                        share.url  = str1;
                      }
                      openMNActionButtonShop(share);
                    }
                },
            },
        });
    }
    function addListeners() {
        api.addEventListener({
            name: 'addcategory'
        }, function () {
           closeWin('addcategory');
           refresh();
        });

        api.addEventListener({
            name: 'savecategory'
        }, function () {
           refresh();
        });

        api.addEventListener({
            name: 'viewappear'
        }, function () {
            onPageStart();
        });

        api.addEventListener({
            name: 'viewdisappear'
        }, function () {
            onPageEnd();
        });

        api.addEventListener({
            name: 'keyback'
        }, function () {
            onPageEnd();
            api.closeWin();
        });
    }
</script>
</html>
